<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>达内－NetCTOSS</title>
        <link type="text/css" rel="stylesheet" media="all" href="../styles/global.css" />
        <link type="text/css" rel="stylesheet" media="all" href="../styles/global_color.css" />
        <script language="javascript" type="text/javascript" src="../js/jquery-1.4.3.js"></script>
        <script language="javascript" type="text/javascript">
        	var rName=false,rId=false,rLogin=false,rPassF=false,rPassS=false,rPhone=false;
        	var rIdcardNo=true,theEmail=true,address=true,postcode=true,theQq=true;
        	var others = rIdcardNo&&theEmail&&address&&postcode&&theQq;
            //保存成功的提示信息
            function showResult() {
            	if(!rName){
            		showResultDiv(true);
            		$("#save_result_info").text("保存失败，姓名输入不正确");
                	window.setTimeout("showResultDiv(false);", 3000);
                	return;
            	}else if(!rId){
            		showResultDiv(true);
            		$("#save_result_info").text("保存失败，身份证输入不正确");
                	window.setTimeout("showResultDiv(false);", 3000);
                	return;
            	}else if(!rLogin){
            		showResultDiv(true);
            		$("#save_result_info").text("保存失败，登录账号输入不正确");
                	window.setTimeout("showResultDiv(false);", 3000);
                	return;
            	}else if(!rPassF||!rPassS){
            		showResultDiv(true);
            		$("#save_result_info").text("保存失败，密码输入不正确");
                	window.setTimeout("showResultDiv(false);", 3000);
                	return;
            	}else if(!rPhone){
            		showResultDiv(true);
            		$("#save_result_info").text("保存失败，电话输入不正确");
                	window.setTimeout("showResultDiv(false);", 3000);
                	return;
            	}else if(!others){
            		showResultDiv(true);
            		$("#save_result_info").text("选填信息有误");
                	window.setTimeout("showResultDiv(false);", 3000);
                	return;
            	}
                document.forms[0].submit();
            }
            function showResultDiv(flag) {
                var divResult = document.getElementById("save_result_info");
                if (flag)
                    divResult.style.display = "block";
                else
                    divResult.style.display = "none";
            }

            //显示选填的信息项
            function showOptionalInfo(imgObj) {
                var div = document.getElementById("optionalInfo");
                if (div.className == "hide") {
                    div.className = "show";
                    imgObj.src = "../images/hide.png";
                }
                else {
                    div.className = "hide";
                    imgObj.src = "../images/show.png";
                }
            }
            function checkIdcardNo(idcardNo){
            	//校验身份证号是否为空
            	if(idcardNo==null||idcardNo==""){
            		document.getElementById("idcardNoMsg").innerHTML="请输入身份证号";
            		return;
            	}
            	//校验身份证号格式
            	var reg = /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{4}$/;
            	if(!reg.test(idcardNo)){
            		document.getElementById("idcardNoMsg").innerHTML="请输入正确的身份证号";
            		rId=false;
            		return;
            	} else {
            		$.post(
            			"searchAccount",{"idcardNo":idcardNo},function(data){
            				var account = data;
            				if(account == null){
			            		document.getElementById("idcardNoMsg").innerHTML="输入正确";
			            		rId=true;
            				}else{
	            				document.getElementById("idcardNoMsg").innerHTML="该身份证已经存在";
	            				rId=false;
            				}
            			}
            		);
            	}
            	//从身份证中截取生日
            	var year = idcardNo.substring(6,10);
            	var month = idcardNo.substring(10,12);
            	var day = idcardNo.substring(12,14);
            	var birthday = year+"-"+month+"-"+day;
            	document.getElementById("birthday").value = birthday;
            }
            $(function(){
            	//页面加载完执行下面的内容
            	$("#recommenderIdcardNo").blur(function(){
            		var idcardNo = $(this).val();
            		//校验身份证
            		var reg = /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{4}$/;
            		if(!reg.test(idcardNo)){
            			if(idcardNo != (null ||"")){
            				$("#recommenderIdcardNoMsg").text("请输入正确的身份证号");
            				rIdcardNo = false;
            				return;            			
            			}
            			$("#recommenderIdcardNoMsg").text("正确的身份证号码格式");
            			return;
            		}
	            	//根据推荐人身份证查询推荐人数据
            		$.post(
            			"searchAccount",{"idcardNo":idcardNo},function(data){
            				var account = data;
            				if(account == null){
            					$("#recommenderIdcardNoMsg").text("不存在该推荐人，请重新输入！");
            					rIdcardNo = false;
            				}else{
            					$("#recommenderId").val(account.id);
	            				$("#recommenderIdcardNoMsg").text("正确的身份证号码格式");
	            				rIdcardNo = true;
            				}
            			}
            		);
            	});
            	//姓名
            	$("#realName").blur(function(){
            		var name = $(this).val();
            		var reg = /^[\u4E00-\u9FA5A-Za-z0-9]{2,20}$/;
            		if(!reg.test(name)){
            			$("#realNameMsg").text("请输入正确的姓名");
            			rName=false;
            			return;
            		}else{
            			$("#realNameMsg").text("输入正确");
            			rName=true;
            		}
            	});
            	//登录名
            	$("#loginNo").blur(function(){
            		var loginName = $(this).val();
            		var reg = /^[\w]{1,20}$/;
            		if(!reg.test(loginName)){
            			$("#loginNoMsg").text("请输入正确的账号");
            			rLogin=false;
            			return;
            		}else{
	            		$.post(
	            			"checkAccount",{"loginName":loginName},function(data){
	            				var account = data;
	            				if(account == null){
				            		$("#loginNoMsg").text("输入正确");
				            		rLogin=true;
	            				}else{
		            				$("#loginNoMsg").text("该登录名已经存在");
		            				rLogin=false;
	            				}
            				}
            			);
            		}
            	});
            	//密码
            	$("#passWd").blur(function(){
            		var passWord = $(this).val();
            		var reg = /^[\w]{1,20}$/;
            		if(!reg.test(passWord)){
            			$("#passWdMsg").text("请输入正确的密码");
            			rPassF=false;
            			return;
            		}else{
            			$("#passWdMsg").text("输入正确");
            			rPassF=true;
            		}
            		if(passWord != $("#rePassWd").val()){
            			$("#rePassWdMsg").text("请输入与上面相同的密码");
            			rPassS=false;
            		}else if(passWord == $("#rePassWd").val()){
            			$("#rePassWdMsg").text("输入正确");
            			rPassS=true;
            		}
            	});
            	//重复密码
            	$("#rePassWd").blur(function(){
            		var passW = $("#passWd").val();
            		var rePassW = $(this).val();
            		if(passW != rePassW){
            			$("#rePassWdMsg").text("您输入的密码与上面不同");
            			rPassS=false;
            			return;
            		}else{
            			if(rePassW!=null&&rePassW!=""){
	            			$("#rePassWdMsg").text("输入正确");
	            			rPassS=true;
            			}else{
            				$("#rePassWdMsg").text("请输入密码");
            				rPassS=false;
            			}
            		}
            	});
            	//电话
           		$("#thePhone").blur(function(){
            		var phone = $(this).val();
            		var tel = /^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/;
            		var pho = /\d{3}-\d{8}|\d{4}-\d{7}/;
            		if(!tel.test(phone)&&!pho.test(phone)){
            			$("#thePhoneMsg").text("请输入正确的号码");
            			rPhone=false;
            			return;
            		}else{
            			$("#thePhoneMsg").text("输入正确");
            			rPhone=true;
            		}
            	});
            	//Email
            	$("#theEmail").blur(function(){
            		var email = $(this).val();
            		var len = email.length;
            		var reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
            		if(!reg.test(email)||len>50){
            			$("#theEmailMsg").text("请输入正确的Email地址");
            			if(email!=(null||"")){
            				theEmail = false;
            			}else{
	            			$("#theEmailMsg").text("50长度以内，合法的 Email 格式");
	            			theEmail = true;
            			}
            			return;
            		}else{
            			theEmail = true;
            			$("#theEmailMsg").text("输入正确");
            		}
            	});
            	//地址
            	$("#address").blur(function(){
            		var adr = $(this).val();
            		var reg = /^[\u4E00-\u9FA5A-Za-z0-9_-]{1,50}$/;
            		if(!reg.test(adr)){
            			$("#addressMsg").text("地址或输入长度不正确");
            			if(adr!=(null||"")){
            				address = false;
            			}else{
	            			$("#addressMsg").text("50长度以内");
	            			address = true;
            			}
            			return;
            		}else{
            			address = true;
            			$("#addressMsg").text("输入正确");
            		}
            	});
            	//邮编
            	$("#postcode").blur(function(){
            		var pcode = $(this).val();
            		var reg = /[1-9]\d{5}(?!\d)/;
            		if(!reg.test(pcode)){
            			$("#postcodeMsg").text("邮政编码不正确");
            			if(pcode!=(null||"")){
            				postcode = false;
            			}else{
	            			$("#postcodeMsg").text("6位数字");
	            			postcode = true;
            			}
            			return;
            		}else{
            			postcode = true;
            			$("#postcodeMsg").text("输入正确");
            		}
            	});
            	//QQ
            	$("#qq").blur(function(){
            		var qq = $(this).val();
            		var reg = /^[1-9][0-9]{4,12}$/;
            		if(!reg.test(qq)){
            			$("#qqMsg").text("QQ号码不正确");
            			if(qq!=(null||"")){
            				theQq = false;
            			}else{
	            			$("#qqMsg").text("5到13位数字");
	            			theQq = true;
            			}
            			return;
            		}else{
            			theQq = true;
            			$("#qqMsg").text("输入正确");
            		}
            	});
            });
        </script>
    </head>
    <body>
        <!--Logo区域开始-->
        <div id="header">
            <img src="../images/logo.png" alt="logo" class="left"/>
            <a href="#">[退出]</a>            
        </div>
        <!--Logo区域结束-->
        <!--导航区域开始-->
        <div id="navi">
            <ul id="menu">
                <li><a href="../index/index" class="index_off"></a></li>
                <li><a href="../role/findRole" class="role_off"></a></li>
                <li><a href="../admin/findAdmin" class="admin_off"></a></li>
                <li><a href="../cost/findCost" class="fee_off"></a></li>
                <li><a href="../account/findAccount" class="account_on"></a></li>
                <li><a href="../service/findService" class="service_off"></a></li>
                <li><a href="../bill/findBill" class="bill_off"></a></li>
                <li><a href="../report/findReport" class="report_off"></a></li>
                <li><a href="../user/userInfo" class="information_off"></a></li>
                <li><a href="../user/userModiPwd" class="password_off"></a></li>
            </ul>
        </div>
        <!--导航区域结束-->
        <!--主要区域开始-->
        <div id="main">       
            <!--保存成功或者失败的提示消息-->     
            <div id="save_result_info" class="save_fail">保存失败，该身份证已经开通过账务账号！</div>
            <form action="addAccount" method="post" class="main_form">
                <!--必填项-->
                <div class="text_info clearfix"><span>姓名：</span></div>
                <div class="input_info">
                    <input type="text" name="account.realName" id="realName" />
                    <span class="required">*</span>
                    <div class="validate_msg_long" id="realNameMsg">20长度以内的汉字、字母和数字的组合</div>
                </div>
                <div class="text_info clearfix"><span>身份证：</span></div>
                <div class="input_info">
                	<input type="text"name="account.idcardNo"  onblur="checkIdcardNo(this.value);"/>
                    <span class="required">*</span>
                    <div class="validate_msg_long" id="idcardNoMsg">正确的身份证号码格式</div>
                </div>
                <div class="text_info clearfix"><span>登录账号：</span></div>
                <div class="input_info">
                    <input type="text" id="loginNo" name="account.loginName" />
                    <span class="required">*</span>
                    <div class="validate_msg_long" id="loginNoMsg">30长度以内的字母、数字和下划线的组合</div>
                </div>
                <div class="text_info clearfix"><span>密码：</span></div>
                <div class="input_info">
                    <input type="password" id="passWd" name="account.loginPassword"/>
                    <span class="required">*</span>
                    <div class="validate_msg_long" id="passWdMsg">30长度以内的字母、数字和下划线的组合</div>
                </div>
                <div class="text_info clearfix"><span>重复密码：</span></div>
                <div class="input_info">
                    <input type="password" id="rePassWd" />
                    <span class="required">*</span>
                    <div class="validate_msg_long" id="rePassWdMsg">两次密码必须相同</div>
                </div>     
                <div class="text_info clearfix"><span>电话：</span></div>
                <div class="input_info">
                    <input type="text" class="width200" id="thePhone" name="account.telephone"/>
                    <span class="required">*</span>
                    <div class="validate_msg_medium" id="thePhoneMsg">正确的电话号码格式：手机或固话</div>
                </div>                
                <!--可选项-->
                <div class="text_info clearfix"><span>可选项：</span></div>
                <div class="input_info">
                    <img src="../images/show.png" alt="展开" onclick="showOptionalInfo(this);" />
                </div>
                <div id="optionalInfo" class="hide">
                    <div class="text_info clearfix"><span>推荐人身份证号码：</span></div>
                    <div class="input_info">
                    	<input type="hidden" name="account.recommenderId" id="recommenderId"/>
                        <input type="text" id="recommenderIdcardNo"/>
                        <div class="validate_msg_long" id="recommenderIdcardNoMsg">正确的身份证号码格式</div>
                    </div>
                    <div class="text_info clearfix"><span>生日：</span></div>
                    <div class="input_info">
                        <input type="text" id="birthday" readonly="readonly" class="readonly" name="account.birthdate"/>
                    </div>
                    <div class="text_info clearfix"><span>Email：</span></div>
                    <div class="input_info">
                        <input type="text" class="width350" id="theEmail" name="account.email"/>
                        <div class="validate_msg_tiny" id="theEmailMsg">50长度以内，合法的 Email 格式</div>
                    </div> 
                    <div class="text_info clearfix"><span>职业：</span></div>
                    <div class="input_info">
                        <select name="account.occupation">
                            <option value="1">干部</option>
                            <option value="2">学生</option>
                            <option value="3">技术人员</option>
                            <option value="4">其他</option>
                        </select>                        
                    </div>
                    <div class="text_info clearfix"><span>性别：</span></div>
                    <div class="input_info fee_type">
                        <input type="radio" name="account.gender" checked="checked" id="female" value="0"/>
                        <label for="female">女</label>
                        <input type="radio" name="account.gender" id="male" value="1"/>
                        <label for="male">男</label>
                    </div> 
                    <div class="text_info clearfix"><span>通信地址：</span></div>
                    <div class="input_info">
                        <input type="text" class="width350" id="address" name="account.mailaddress"/>
                        <div class="validate_msg_tiny" id="addressMsg">50长度以内</div>
                    </div> 
                    <div class="text_info clearfix"><span>邮编：</span></div>
                    <div class="input_info">
                        <input type="text" id="postcode" name="account.zipcode"/>
                        <div class="validate_msg_long" id="postcodeMsg">6位数字</div>
                    </div> 
                    <div class="text_info clearfix"><span>QQ：</span></div>
                    <div class="input_info">
                        <input type="text" id="qq" name="account.qq"/>
                        <div class="validate_msg_long" id="qqMsg">5到13位数字</div>
                    </div>                
                </div>
                <!--操作按钮-->
                <div class="button_info clearfix">
                    <input type="button" value="保存" class="btn_save" onclick="showResult();" />
                    <input type="button" value="取消" class="btn_save" onclick="javascript:history.go(-1)"/>
                </div>
            </form>  
        </div>
        <!--主要区域结束-->
        <div id="footer">
            <span>[源自北美的技术，最优秀的师资，最真实的企业环境，最适用的实战项目]</span>
            <br />
            <span>版权所有(C)加拿大达内IT培训集团公司 </span>
        </div>
    </body>
</html>

